<template>
	<Select
		:value="value"
		filterable
		clearable
		:multiple="multiple"
		:disabled="disabled"
		:transfer="transfer"
		@on-change="handleChange"
		@on-clear="handleClear"
		@on-open-change="handleOpenChange"
	>
		<Option v-for="item in brands" :key="item.id" :value="item.id">{{ item.name }}</Option>
    </Select>
</template>

<script>
export default {
	name: 'selectBrand',
	props: {
		value: Number,
		multiple: {
			type: Boolean,
			default: false
		},
		disabled: {
			type: Boolean,
			default: false
		},
		transfer: {
			type: Boolean,
			default: false
		}
	},
	computed: {
		brands() {
        	return this.$store.state.app.brands;
        }
	},
	mounted() {
		// 检查并更新品牌数据
		this.$store.dispatch('getBrandData');
	},
	methods: {
		handleChange(value) {
			this.$emit('input', value);
			this.$emit('on-change', value);
		},
		handleClear() {
			this.$emit('on-clear');
		},
		handleOpenChange(status) {
			this.$emit('on-open-change', status);
		}
	}
}
</script>